<template>
  <div id="app">
    <div class="main-index">
      <div class="tabbar">
        <div class="tab-item">
          <router-link to="/goods">
            <span class="icon iconfont icon-shangpin"></span>
            <p class="text">商品</p>
          </router-link>
        </div>
        <div class="tab-item">
          <router-link to="/order">
            <span class="icon iconfont icon-shouye"></span>
            <p class="text">订单</p>
          </router-link>
        </div>
        <div class="tab-item">
          <router-link to="/yd">
            <span class="icon iconfont icon-yuding1"></span>
            <p class="text">预定</p>
          </router-link>
        </div>
        <div class="tab-item">
          <router-link to="/dc">
            <span class="icon iconfont icon-diancan dc"></span>
            <p class="text">点餐</p>
          </router-link>
        </div>
        <div class="tab-item">
          <router-link to="/shop">
            <span class="icon iconfont icon-dianpu"></span>
            <p class="text">店铺</p>
          </router-link>
        </div>
      </div>
      <loading v-show="loading"></loading>
      <router-view></router-view>
    </div>
    
  </div>
</template>

<script>
import loading from 'components/loading/loading.vue';
import {saveToLocal, loadFromLocal} from 'common/js/store';
import {exit} from 'common/js/localStorage.js'
import { mapGetters, mapActions } from 'vuex'
import axios from 'axios'
export default {
  name: 'app',
  data() {
    return {
      selected:''
    }
  },
  mounted() {
    if(localStorage.getItem("logined")){
      let token = localStorage.getItem("access_token");
      // axios.post(HOST + "/Shop/check_login",{"access_token":token}).then((res) => {
      //   res = res.data
      //   if(res.result == 'error'){
      //     this.$router.push('/login');
      //   }
      // })
    }else{
      this.$router.push('/login');
    }
    this.$http.get().then((response) => {
      response=response.body;

    });

      
  },
  components:{
    loading
  },
  methods:{
    toexit(){
      exit();
      document.getElementById('app_login').style.left = 0 + 'px';
    }
    
  },
  computed: {
    ...mapGetters([
      'loading',
    ])
  }
}
</script>

<style lang="stylus">
// @import 'common/stylus/icon.css'
// @import 'common/stylus/reset.css'
#app
  .no-data
    position: absolute
    top: 100px
    left: 0
    width 100%
    text-align center
  font-family: 'Avenir', Helvetica, Arial, sans-serif
  .mint-cell:last-child
    background-image: -webkit-linear-gradient(bottom, #fff, #fff 50%, transparent 50%) 
    background-image: linear-gradient(0deg, #fff, #fff 50%, transparent 50%)
  .mint-cell-wrapper
    background-image: -webkit-linear-gradient(top, #fff, #fff 50%, transparent 50%)
    background-image: linear-gradient(180deg, #fff, #fff 50%, transparent 50%)
  .main-index
    .tabbar
      z-index:9
      position:fixed
      left:0
      bottom:0
      width:100%
      height:48px
      display:flex
      background-color: rgba(242, 242, 242, 1);
      border-top:1px solid rgba(216, 216, 216, 1);
      .tab-item
        flex:1
        display:inline-block
        height:50px
        line-height:50px
        position:relative
        .router-link-active
          color:#108EE9
        .icon
          position: absolute
          top: 7px
          left: 25px
          font-size: 20px
          height: 20px
          line-height: 20px
          &.dc
            top:5px
        .text
          position: absolute
          top: 30px
          left: 22px
          font-size: 14px
          height: 14px
          line-height: 14px
          

</style>
